<template>
  <div class="box">
    <el-breadcrumb separator=">">
      <el-breadcrumb-item to="/login" replace>首页</el-breadcrumb-item>
      <el-breadcrumb-item to="/login/user" replace>用户管理</el-breadcrumb-item>
      <el-breadcrumb-item>同盾详情信息</el-breadcrumb-item>
    </el-breadcrumb>
    <div class="tableBox">
      <div class="tableTitle">同盾详情信息</div>
      <div class="table">
        <div class="title" v-if="showButton">
          <el-button type="primary" size="mini">重新认证</el-button>
        </div>
        <div class="content">
          <el-row>
            <el-col :span="6">数据编号</el-col>
            <el-col :span="6">1810</el-col>
            <el-col :span="6">信用得分</el-col>
            <el-col :span="6">18</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">是否调用成功</el-col>
            <el-col :span="6">成功</el-col>
            <el-col :span="6">返回代码</el-col>
            <el-col :span="6">18</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">策略名称</el-col>
            <el-col :span="6">借款事件_安卓</el-col>
            <el-col :span="6">描述</el-col>
            <el-col :span="6">无风险，通过</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">同盾seqId</el-col>
            <el-col :span="6">1533101760049639S427A79C94018365</el-col>
            <el-col :span="6">花费时间</el-col>
            <el-col :span="6">53</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">理由描述</el-col>
            <el-col :span="18">获取成功</el-col>
          </el-row>
          <div class="hitrules">
            <div>所有策略命中的规则</div>
            <div>
              <div class="header">身份证命中中风险关注名单</div>
              <div>
                <el-row>
                  <el-col :span="12">命中分数</el-col>
                  <el-col :span="12">5</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">命中灰名单的身份证</el-col>
                  <el-col :span="12">133030198604041812</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">风险级别的显示名</el-col>
                  <el-col :span="12">中</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">风险类型显示名</el-col>
                  <el-col :span="12">异常借款</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">证据时间</el-col>
                  <el-col :span="12">1528854577000</el-col>
                </el-row>
              </div>
              <div class="header">手机号命中中风险关注名单</div>
              <div>
                <el-row>
                  <el-col :span="12">命中分数</el-col>
                  <el-col :span="12">5</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">命中灰名单的手机号</el-col>
                  <el-col :span="12">15128120081</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">风险级别的显示名</el-col>
                  <el-col :span="12">中</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">风险类型显示名</el-col>
                  <el-col :span="12">异常借款</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">证据时间</el-col>
                  <el-col :span="12">1528854577000</el-col>
                </el-row>
              </div>
              <div class="header">3个月内申请人在多个平台申请借款</div>
              <div>
                <el-row>
                  <el-col :span="12">命中分数</el-col>
                  <el-col :span="12">2</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">一般消费分期平台</el-col>
                  <el-col :span="12">1</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">P2P网贷</el-col>
                  <el-col :span="12">1</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">合计</el-col>
                  <el-col :span="12">2</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">借款人座机命中的关联合作方个数</el-col>
                  <el-col :span="12">1</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">借款人手机命中的关联合作方个数</el-col>
                  <el-col :span="12">2</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">借款人身份证命中的关联合作方个数</el-col>
                  <el-col :span="12">2</el-col>
                </el-row>
              </div>
              <div class="header">6个月内申请人在多个平台申请借款</div>
              <div>
                <el-row>
                  <el-col :span="12">命中分数</el-col>
                  <el-col :span="12">0</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">一般消费分期平台</el-col>
                  <el-col :span="12">3</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">小额贷款公司</el-col>
                  <el-col :span="12">1</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">P2P网贷</el-col>
                  <el-col :span="12">2</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">合计</el-col>
                  <el-col :span="12">6</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">借款人手机匹配借款事件的借款人手机关联的合作方个数</el-col>
                  <el-col :span="12">6</el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">借款人身份证匹配借款事件的借款人身份证关联的合作方个数</el-col>
                  <el-col :span="12">6</el-col>
                </el-row>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
  export default {
    data () {
      return {
        showButton: false
      }
    },
    created () {
    },
    methods: {}
  }
</script>

<style lang="less" ref="stylesheet/less" scoped>
  .table{
    text-align: center;
    .title{
      padding: 20px 0;
      border-bottom: 1px solid #eee;
    }
    .content{
      > .el-row{
        > .el-col{
          padding: 20px 0;
          border-right: 1px solid #eee;
          border-bottom: 1px solid #eee;
          &:last-child{
            border-right: none;
          }
        }
      }
      .hitrules{
        display: flex;
        align-items: center;
        > div{
          &:first-child{
            flex: 25% 0 0;
            width: 25%;
          }
          &:last-child{
            flex: 1 0 0;
            .header{
              padding: 20px 0;
              border-left: 1px solid #eee;
              border-bottom: 1px solid #eee;
              background-color: #000;
              color: #fff;
              font-weight: bold;
            }
            .el-row{
              .el-col{
                padding: 20px 0;
                border-left: 1px solid #eee;
                border-bottom: 1px solid #eee;
              }
            }
          }
        }
      }
    }
  }
</style>
